<template>
	<view class="main">
		<view v-show="!isDetail" class="mb-20">
			<view class="text-con">根据工信部《物联网卡用户身份登记规定》开通使用需要输入ICCID号码</view>
			<u-field v-model="sPhone" class="mb-20" label="卡号" placeholder="请输入卡号" />
			<u-button type="primary" @click="fDetail">查询</u-button>
			<!-- <u-button type="primary" @click="fRecharge">充值</u-button> -->
		</view>
		<u-alert-tips v-show="sErrorMsg" type="warning" :title="sErrorMsg" />
		<detail v-show="isDetail" ref="Detail" @back="isDetail = false" @fDetail="fDetail" />
		
		<view class="contact">
			<view>遇到问题请联系：0573-82861005</view>
			<view>服务时间：周一到周五 9:00-18:00</view>
		</view>
	</view>
</template>

<script>
	import Detail from './components/Detail.vue'
	export default {
		components: {
			Detail
		},
		data() {
			return {
				// sPhone: '898604A6102170516527',
				// sPhone: '89860491102190041442',
				sPhone: '',
				isDetail: false,
				sErrorMsg: ''
			}
		},
		onLoad() {
		},
		methods: {
			fDetail() {
				if (!this.sPhone) {
					this.sErrorMsg = '请输入卡号查询'
					return
				}
				this.$u.api.getSimCardDetail(this.sPhone).then(res => {
					const arr = res.result
					if (arr && arr.length >= 1) {
						const obj = arr[0]
						if (obj.code == 0) {
							this.sErrorMsg = ''
							this.isDetail = true
							// this.isRecharge = false
							this.$refs.Detail.fInit(obj)
						} else {
							this.sErrorMsg = obj.message
						}
					} else {
						this.sErrorMsg = '查询失败'
					}
				})
			},
			onShareAppMessage(res) {
			    // if (res.from === 'button') {// 来自页面内分享按钮
			    //   console.log(res.target)
			    // }
			    return {
			      title: '劢领科技',
			      path: '/pages/index'
			    }
			  },
			fRecharge() {
				// this.$u.api.wxPay().then(res => {
				// 	console.log(res.data)
				// 	wx.requestPayment({
				// 		...res.data,
				// 		success(res) {
				// 			console.log('pay success', res)
				// 			console.log('支付成功')
				// 		},
				// 		fail({ errMsg }) {
				// 			const msg = errMsg.replace('requestPayment:fail ', '')
				// 			if (msg === 'cancel') {
				// 				console.log('取消支付')
				// 			} else {
				// 				console.log('支付失败', msg)
				// 			}
				// 		}
				// 	})
				// })
			}
		}
	}
</script>

<style lang="scss">
	.main {
		padding: 10rpx;

		.header {
			background-color: #fff;
			font-size: 14px;
			margin-bottom: 10rpx;
			padding: 10rpx;
		}
		.text-con {
			width: 90%;
			height: 120rpx;
			margin:0 auto;
			background: #eee;
			border-radius: 10rpx;
			line-height: 40rpx;
			padding: 20rpx;
			margin-top: 80rpx;
		}
		
		.contact{
			position: fixed;
			bottom: 40rpx;
			left: 0;
			width: 100%;
			// background-color: red;
			text-align: center;
			font-size: 14px;
			>view{
				margin-bottom: 6rpx;
			}
		}
	}
</style>
